import {
	Button,
	Form,
	Row,
	Col,
	Input,
	Select,
	DatePicker as TDatePicker,
	Modal,
	Radio,
	Space,
	Checkbox,
	TreeSelect,
	InputNumber,
	Cascader,
	message,
	Table,
} from 'antd'
import type {RangePickerProps} from 'antd/es/date-picker'
import React, {useState, useEffect, memo} from 'react'
import {connect, history} from 'umi'
import {PlusOutlined} from '@ant-design/icons'
import type {CheckboxValueType} from 'antd/es/checkbox/Group'
import {CheckboxChangeEvent} from 'antd/lib/checkbox'
import moment from 'moment'
import styles from './index.less'
import {getDict} from '@/service/common/dict'
import {
	getAllCitys,
	getCompany,
	getHolderDictInfo,
} from '@/service/common/index'
import {
	stocktakeCreate,
	stocktakeUpdate,
	stocktakePreview,
	getstocktakeInfo,
	getstocktakeCommon,
} from '@/service/storage/inventoryPlan'
import {
	licenseProperty,
	carLicenseStatus,
	checkType,
	enter,
	dataKey,
	carStatus,
	maintenanceStatus,
	compulsoryInsuranceStatus,
	isGPS,
	isPlate,
	isTBOX,
	isInventory,
	operationType,
	onlineCarLicenseStatus,
	isExitReason,
	isStopOperate,
	motStatus,
	commercialInsuranceStatus,
	SYS,
} from '../../dict'
import {modelSeriesFun, translateDataToTree} from '@/utils/common/index'
import {getCarTypeList} from '@/service/carMessage/list'
import OperationRecord from '@/components/OperationRecord'

const {TextArea} = Input
const key = dataKey.map((item) => item.name)
const DatePicker: any = TDatePicker

interface CityOption {
	value: string | number
	label: string
	children?: CityOption[]
}
const add = memo(
	(props: {
		user: {userId: string; userName: string; orgId: string | number}
		location: any
	}) => {
		const [basicsForm] = Form.useForm()
		const {query} = props.location
		const [, setDict] = useState({
			Claim_Insurance_Type: [],
			Accident_Status: [],
			Accident_Level: [],
			Accident_Type: [],
			Duty_Type: [],
		})
		const [type, setType] = useState<string>()
		const [, setIdInventory] = useState<any>(null)
		const [, setIsModalOpen] = useState(false)
		const [customModalOpen, setCustomModalOpen] = useState(false)
		const [isFullDose, setisFullDose] = useState<boolean>(true) // 是否展示全量盘点，抽盘
		const [IsDisable, setIsDisable] = useState<boolean>(false) // 是否禁用日期
		const [isTableDynamic, setIsTableDynamic] = useState<boolean>(false) // 是否禁用日期
		const [IsOffer, setIsOffer] = useState<any>(1) // isMatchFullStocktake
		const [citysList, setCitysList] = useState<CityOption[]>([]) // 初始化城市
		const [carTypeList, setCarTypeList] = useState<any>([]) // 初始化品牌车系车系
		const [holderDict, setHolderDict] = useState([]) // 初始化持有方
		const [companyData, setCompanyData] = useState<any[]>([]) // 初始化所属公司
		const [AllSelect, setAllSelect] = useState<any[]>([]) // 系统字段是否全部选择
		const [customFieldList, setCustomFieldList] = useState<any[]>([]) // 处理自定义字段 key-valuesetValueScope
		const [newCustom, setNewCustom] = useState<any[]>([])
		const [newValueScope, setValueScope] = useState<any[]>([]) // 处理自定义字段 key-valuesetValueScope
		const [inventory, setInventory] = useState<any[]>([]) // 处理通用盘点你清单
		const [tableList, setTableList] = useState([]) // 处理动态列表的数据源
		const [columns, setColumns] = useState([]) // 处理动态列表的数据源
		const [total, setTotal] = useState(0)
		const [customSelect, setCustomSelect] = useState<any[]>([]) // 自定义字段
		const [bool, setBool] = useState<any[]>([]) // 自定义字段
		// const [isMatchFullStocktake, setIsMatchFullStocktake] =
		// 	useState<any>(null) // 匹配抽盘的data
		const [systemFields, setSystemFields] = useState(false) // 系统字段全选状态
		const [fieldValue, setFieldValue] = useState(true) // 新增自定义字段-是否显示字段取值

		// 根据路由判断当前页面状态
		useEffect(() => {
			const hrefs = window.location.href
			if (hrefs.includes('view')) {
				setType('view')
				setSystemFields(true)
			} else if (hrefs.includes('add')) {
				setType('add')
				basicsForm.setFieldsValue({isMatchFullStocktake: 1})
			} else {
				setType('edit')
			}
			getDict(
				{
					dictKeys: [
						'license_plate_nature', // 车票性质
						'Accident_Status',
						'Accident_Level',
						'Accident_Type',
						'Duty_Type',
					],
				},
				(res: any) => {
					setDict(res)
				},
			)
		}, [])

		// 初始化城市
		const getCitysFun = () => {
			getAllCitys().then((res: any) => {
				if (res?.success) {
					setCitysList(() => res.data)
				}
			})
		}
		useEffect(() => {
			getCitysFun()
			if (query?.id) {
				getstocktakeInfo({id: query?.id}).then((res: any) => {
					if (res?.success) {
						const selectFiledList = res?.data?.selectFiledList
						const obj: any = {}
						selectFiledList?.forEach(
							(item: {name: string; value: any}) => {
								if (
									item?.name === 'city_id' ||
									item?.name === 'fashion_id' ||
									item?.name === 'org_id' ||
									item?.name === 'holder_id' ||
									item?.name === 'number_type'
								) {
									if (item?.value) {
										obj[item.name] = Number(item?.value)
									} else {
										obj[item.name] = ''
									}
								} else {
									obj[item.name] = item?.value
								}
							},
						)
						getAllCitys().then((_res: any) => {
							if (_res?.success) {
								/** 根据城市id查询省份id */
								let cityData: any = {}
								_res?.data?.forEach((item: any) => {
									item?.cityInfoList?.forEach(
										(items: any) => {
											if (items?.id === obj.city_id) {
												cityData = [item?.id, items?.id]
											}
										},
									)
								})
								basicsForm.setFieldsValue({
									...res.data,
									generateDate: moment(
										res?.data?.generateTime,
										'YYYY-MM-DD',
									),
									...obj,
									city_id: obj.city_id ? cityData : [],
								})
								setIsDisable(res?.data?.generateStrategy === 2)

								setAllSelect(
									Object.keys(obj).filter(
										(item) => !key.includes(item),
									),
								)
								setisFullDose(res?.data?.type !== 1)

								setIsOffer(res?.data?.isMatchFullStocktake)
								// valueScopeList
								const list = JSON.parse(
									JSON.stringify(res?.data?.customFieldList),
								)
								list.forEach((res1: any, index: number) => {
									list[index].typeStatus = res1.type === 2
									const list2 = res1.valueScope.split(',')
									const list3: any = []
									list2.forEach(
										(info: any, index1: number) => {
											const obj1 = {
												id: index1,
												name: info,
											}
											list3.push(obj1)
										},
									)
									list[index].valueScopeList = list3
								})
								setValueScope(res?.data?.customFieldList)
								setCustomFieldList(list)
								setNewCustom(res?.data?.customFieldList)
								setCustomSelect(
									res?.data?.customFieldList.map(
										(item: {name: any}) => item.name,
									),
								)
							}
						})
					}
				})
			}
		}, [query])

		const inventorylist = () => {
			getstocktakeCommon()
				.then((res) => {
					if (res?.success) {
						setInventory(res?.data)
					}
				})
				.catch((err) => {
					message.error(err)
				})
		}
		/** 获取所属公司数据 */
		const onCompany = () => {
			getCompany({merchantId: props?.user?.orgId}).then((res: any) => {
				if (res?.success) {
					const list = translateDataToTree(res.data)
					setCompanyData(list as any)
					basicsForm.setFieldsValue({org_id: undefined})
				}
			})
		}

		// 获取品牌车系
		const onCarTypeListFun = () => {
			getCarTypeList().then((res: any) => {
				if (res?.success) {
					setCarTypeList(modelSeriesFun(res.data))
				}
			})
		}
		// 初始化-持有方数据
		const getDeptFun = () => {
			getHolderDictInfo({type: 'holder'}).then((res: any) => {
				if (res?.success) {
					setHolderDict(res?.data)
				}
			})
		}
		useEffect(() => {
			onCarTypeListFun()
		}, [])
		useEffect(() => {
			getDeptFun()
			onCompany()
			inventorylist() // 获取通用的清单列表
		}, [props?.user?.orgId])
		// 处理自定义字段
		const customData = async () => {
			const basicsValue = await basicsForm.validateFields()
			setCustomModalOpen(false)
			// customFieldList 自定义字段
			const List: any = [] // 处理自定义字段 key-value
			const valueScopeList: any = []
			const newList: any = []
			if (basicsValue.valueScope?.length > 0) {
				const data1 = basicsValue.valueScope.replace(/，/g, ',')
				basicsValue.valueScope = data1
				const data = data1.split(',')
				data.forEach((res: any, index: number) => {
					const obj = {
						id: index + 1,
						name: res,
					}
					valueScopeList.push(obj)
				})
			}
			const params = {
				id: null,
				name: basicsValue._name,
				type: basicsValue._type,
				typeStatus: basicsValue._type === 2,
				valueScope: basicsValue.valueScope,
				valueScopeList,
			}
			const newParams = {
				name: basicsValue._name,
				type: basicsValue._type,
				valueScope: basicsValue.valueScope,
			}
			List.push(params)
			newList.push(newParams)
			const arr = [...customFieldList, ...List]
			if (arr.length > 0) arr.map((item, index) => ({...item, id: index}))
			if (arr?.length > 0) {
				// eslint-disable-next-line no-plusplus
				for (let i = 0; i < arr.length; i++) {
					// eslint-disable-next-line no-plusplus
					for (let j = i + 1; j < arr.length; j++) {
						if (arr[i].name === arr[j].name) {
							arr.splice(j, 1)
							// eslint-disable-next-line no-plusplus
							j--
						}
					}
				}
			}
			setCustomFieldList(arr)
			setNewCustom([...newCustom, ...newList])
		}
		// 提交表单数据
		const onSave = async () => {
			let newData: any = {}
			const basicsValue = await basicsForm.validateFields()
			const selectFiledList: any = [] // 处理可选字段的 key-value
			const newKey = Object.keys(basicsValue)
			dataKey.forEach((item) => {
				if (newKey.includes(item.name)) {
					let newValue
					if (item.name === 'city_id') {
						if (basicsValue[item.name] === null) {
							newValue = ''
						} else if (typeof basicsValue?.city_id === 'string') {
							newValue = basicsValue[item.name]
						} else {
							newValue = basicsValue[item.name]?.[1]
						}
					} else {
						newValue = basicsValue[item.name]
					}
					const newItem = {
						name: item.name,
						value: newValue,
					}
					selectFiledList.push(newItem)
				}
			})
			AllSelect.forEach((item) => {
				if (newKey.includes(item)) {
					const obj = {
						name: item,
						value: basicsValue[item] ? basicsValue[item] : '',
					}
					const data = selectFiledList?.find(
						(items: {name: any}) => items?.name === obj.name,
					)
					if (!data) {
						selectFiledList.push(obj)
					}
				}
			})
			const newCustomList = newCustom.filter((item) =>
				customSelect.includes(item.name),
			)
			if (basicsValue) {
				newData = {
					name: basicsValue.name,
					type: basicsValue.type,
					generateStrategy: basicsValue.generateStrategy,
					generateDate: moment(basicsValue?.generateDate).format(
						'YYYY-MM-DD',
					),
					remark: basicsValue.remark,
					isMatchFullStocktake: IsOffer,
					parentId: IsOffer === 1 ? basicsValue?.parentId : undefined,
					selectFiledList,
					customFieldList: newCustomList,
					randomRatio: basicsValue.randomRatio,
				}
				newData.selectFiledList.forEach((element: any, index: any) => {
					if (Array.isArray(element.value)) {
						newData.selectFiledList.splice(index, 1)
						// delete element.value
					}
				})
				if (type === 'edit') {
					stocktakeUpdate({...newData, id: query.id})
						.then((res) => {
							if (res?.success) {
								message.success(res?.msg)
								history.push(
									'/storage/assetInventory/inventoryPlan',
								)
							}
						})
						.catch((e) => {
							message.error('保存失败', e)
						})
				} else {
					stocktakeCreate({...newData})
						.then((res) => {
							if (res?.success) {
								message.success(res?.msg)
								history.push(
									'/storage/assetInventory/inventoryPlan',
								)
							}
						})
						.catch((e) => {
							message.error('保存失败', e)
						})
				}

				setIsModalOpen(true)
			}
		}

		// 预览生成 动态列表
		const previewlist = async () => {
			setIsTableDynamic(true)
			let newData: any = {}
			const basicsValue = await basicsForm.validateFields()
			const selectFiledList: any = [] // 处理可选字段的 key-value
			const newKey = Object.keys(basicsValue)
			if (type === 'edit') {
				dataKey.forEach((item) => {
					if (newKey.includes(item.name)) {
						let newValue
						if (item.name === 'city_id') {
							if (basicsValue[item.name] === null) {
								newValue = ''
							} else if (basicsValue.city_id.length > 0) {
								newValue = basicsValue[item.name]?.[0]
							} else {
								newValue = basicsValue[item.name]?.[1]
							}
						} else {
							newValue = basicsValue[item.name]
						}
						const newItem = {
							name: item.name,
							value: newValue,
						}
						selectFiledList.push(newItem)
					}
				})
			} else {
				dataKey.forEach((item) => {
					if (newKey.includes(item.name)) {
						let newValue
						if (item.name === 'city_id') {
							if (basicsValue[item.name] === null) {
								newValue = ''
							} else {
								newValue = basicsValue[item.name]?.[1]
							}
						} else {
							newValue = basicsValue[item.name]
						}
						const newItem = {
							name: item.name,
							value: newValue,
						}
						selectFiledList.push(newItem)
					}
				})
			}
			AllSelect.forEach((item) => {
				if (newKey.includes(item)) {
					const obj = {
						name: item,
						value:
							basicsValue[item] !== null ? basicsValue[item] : '',
					}
					selectFiledList.push(obj)
				}
			})
			if (basicsValue) {
				newData = {
					name: basicsValue.name,
					type: basicsValue.type,
					generateStrategy: basicsValue.generateStrategy,
					generateDate: moment(basicsValue?.generateDater).format(
						'YYYY-MM-DD',
					),
					remark: basicsValue.remark,
					isMatchFullStocktake: IsOffer,
					parentId: IsOffer === 1 ? basicsValue?.parentId : undefined,
					selectFiledList,
					customFieldList: newValueScope,
					randomRatio: basicsValue.randomRatio,
				}
				newData.selectFiledList.forEach((element: any, index: any) => {
					if (Array.isArray(element.value)) {
						newData.selectFiledList.splice(index, 1)
						// delete element.value
					}
				})
				stocktakePreview({...newData})
					.then((res) => {
						if (res?.success) {
							// 处理动态列表
							const columnsDynamic = res?.data?.header.map(
								(item: any, index: any) => ({
									key: index,
									title: `${item}`,
									dataIndex: `col${index}`,
									width: 180,
									align: 'center',
									ellipsis: true,
								}),
							)
							setColumns(columnsDynamic)
							setTotal(res?.data?.total)
							const tableDynamic = res?.data?.contents.map(
								(ele: any) =>
									ele.reduce(
										(pre: any, cut: any, _index: any) =>
											Object.assign(pre, {
												[`col${_index}`]: cut,
											}),
										{},
									),
							)
							setTableList(tableDynamic)
						}
						message.success(res?.msg)
					})
					.catch((e) => {
						message.error('预览失败', e)
					})
				setIsModalOpen(true)
			}
		}
		const onChange = () => {}
		const sysOnchange = (checkedValues: CheckboxValueType[]) => {
			setAllSelect(checkedValues)
		}
		// 是否全选自定义字段
		const customchange = (checkedValues: CheckboxValueType[]) => {
			setCustomSelect(checkedValues)
		}
		const allCutSelectSys = (e: CheckboxChangeEvent) => {
			if (e.target.checked) {
				const name = customFieldList.map((id) => id.name)
				setCustomSelect(name)
			} else {
				setCustomSelect([])
			}
		}
		/**
		 *
		 * @param e 系统字段是否全部选择
		 */
		const allSelectSys = (e: CheckboxChangeEvent) => {
			if (e.target.checked) {
				setAllSelect(SYS)
			} else {
				setAllSelect([])
			}
		}
		//  是否展示抽盘
		const isChangeType = (ele: any) => {
			if (ele === 1) {
				setisFullDose(false)
			} else {
				setisFullDose(true)
			}
			// 清空盘点表设置
			basicsForm.setFieldsValue({
				number_type: '',
				holder_id: '',
				city_id: '',
				fashion_id: '',
				owner: '',
				org_id: '',
				randomRatio: '',
			})
			bool.splice(bool.indexOf('org_id'), 1)
		}
		/**
		 *
		 * @param id 匹配全盘的数据
		 */
		const onChangeInventory = (id: number) => {
			if (id) {
				setIdInventory(id)

				const data = inventory.find((item) => item.id === id)
				if (data?.selectFiledList?.length <= 9) {
					setSystemFields(true)
				} else {
					setSystemFields(false)
				}
				// 获取 key 值 且过滤掉盘点表的key
				const name =
					data &&
					data?.selectFiledList
						.map((item: {name: string}) => item.name)
						.filter((ele: string) => !key.includes(ele))
				// 将全盘的数据转换为obj  形式
				const obj: any = {}
				data?.selectFiledList?.forEach(
					(item: {name: string | number; value: any}) => {
						obj[item?.name] = item?.value
					},
				)
				const newBool = data?.selectFiledList
					.filter(
						(item: {value: string; name: any}) =>
							item.value !== '' && item.name,
					)
					.map((ele: {name: any}) => ele.name)
				const disSys = SYS.filter((item) => !name.includes(item))
				setBool([...newBool, ...disSys])
				const list = data?.customFieldList
				list.forEach((res1: any, index: number) => {
					list[index].typeStatus = res1.type === 2
					const list2 = res1.valueScope.split(',')
					const list3: any = []
					list2.forEach((info: any, index1: number) => {
						const obj1 = {
							id: index1,
							name: info,
						}
						list3.push(obj1)
					})
					list[index].valueScopeList = list3
				})
				setCustomFieldList(list)
				setCustomSelect(
					data?.customFieldList.map((item: {name: any}) => item.name),
				)
				setAllSelect(name)
				getAllCitys().then((_res: any) => {
					if (_res?.success) {
						/** 根据城市id查询省份id */
						let cityData: any = {}
						if (obj.city_id) {
							_res?.data?.forEach((item: any) => {
								item?.cityInfoList?.forEach((items: any) => {
									if (items?.id === Number(obj.city_id)) {
										cityData = [item?.id, items?.id]
									}
								})
							})
						}
						basicsForm.setFieldsValue({
							...obj,
							number_type: obj?.number_type
								? Number(obj?.number_type)
								: '',
							holder_id: obj?.holder_id
								? Number(obj?.holder_id)
								: '',
							fashion_id: obj?.fashion_id
								? Number(obj?.fashion_id)
								: '',
							org_id: obj?.org_id ? Number(obj?.org_id) : '',
							city_id: obj.city_id ? cityData : [],
						})
					}
				})
			} else {
				setAllSelect([])
				basicsForm.setFieldsValue({})
			}
		}
		// 新增自定义字段-字段类型改变
		const fieldTypechange = (e: any) => {
			if (e === 1) {
				setFieldValue(false)
			} else {
				setFieldValue(true)
			}
		}
		// 时间禁用
		const disabledDate: RangePickerProps['disabledDate'] = (current: any) =>
			current && current < moment().subtract(1, 'day')

		return (
			<div className={styles.add}>
				<div className={styles.title}>基本信息</div>
				<Form
					form={basicsForm}
					name="basic"
					layout="horizontal"
					labelCol={{flex: '160px'}}
					labelAlign="right"
					labelWrap
					autoComplete="off"
					disabled={type === 'view'}>
					<Row gutter={12}>
						<Col sm={{span: 24}} md={{span: 12}} lg={{span: 12}}>
							<Form.Item
								label="表单名称"
								name="name"
								rules={[{required: true, max: 30}]}>
								<Input placeholder="请输入" />
							</Form.Item>
						</Col>
						<Col sm={{span: 24}} md={{span: 12}} lg={{span: 12}}>
							<Form.Item
								label="盘点类型"
								name="type"
								rules={[{required: true}]}>
								<Select
									placeholder="请选择"
									onChange={(e) => isChangeType(e)}
									fieldNames={{value: 'key', label: 'label'}}
									allowClear
									options={[...checkType]}
								/>
							</Form.Item>
						</Col>
						<Col sm={{span: 24}} md={{span: 12}} lg={{span: 12}}>
							<Form.Item
								label="盘点清单生成时间"
								name="generateStrategy"
								rules={[{required: true}]}>
								<Radio.Group
									onChange={(e) => {
										if (e.target.value === 2) {
											setIsDisable(true)
										} else if (e.target.value === 1) {
											setIsDisable(false)
										}
									}}>
									<Radio value={1}>立即生成</Radio>
									<Radio value={2}>指定日期生成</Radio>
								</Radio.Group>
							</Form.Item>
						</Col>
						{IsDisable ? (
							<Col
								sm={{span: 24}}
								md={{span: 12}}
								lg={{span: 12}}>
								<Form.Item
									label="请选择日期"
									name="generateDate"
									rules={[{required: true}]}>
									<DatePicker
										placeholder="请选择"
										disabledDate={disabledDate}
									/>
								</Form.Item>
							</Col>
						) : null}

						<Col span={24}>
							<Form.Item
								label="表单备注"
								name="remark"
								rules={[{required: true}]}>
								<TextArea
									maxLength={100}
									placeholder="请输入（最多100个字）"
									autoSize={{minRows: 3, maxRows: 6}}
								/>
							</Form.Item>
						</Col>
					</Row>
				</Form>
				<div className={styles.title}>
					盘点表设置
					<Space>
						{type !== 'view' ? (
							<Button
								icon={<PlusOutlined />}
								type="primary"
								ghost
								size="small"
								onClick={() => {
									basicsForm.setFieldsValue({
										_name: '',
										_type: '',
										valueScope: '',
									})
									const a = basicsForm.getFieldValue('name')
									const b = basicsForm.getFieldValue('type')
									const c =
										basicsForm.getFieldValue(
											'generateStrategy',
										)
									const d = basicsForm.getFieldValue('remark')
									if (a && b && c && d) {
										setCustomModalOpen(true)
									} else {
										message.warning('请先填写基本信息')
									}
								}}>
								自定义字段
							</Button>
						) : null}

						<Button
							type="primary"
							ghost
							size="small"
							onClick={() => {
								previewlist()
							}}>
							盘点清单预览
						</Button>
					</Space>
				</div>
				<Form
					form={basicsForm}
					name="basic"
					layout="horizontal"
					labelCol={{flex: '300px'}}
					labelAlign="right"
					// labelWrap
					autoComplete="off"
					disabled>
					<Checkbox.Group
						style={{width: '135%', marginLeft: 20}}
						onChange={onChange}
						defaultValue={[...key]}>
						<Row gutter={12} style={{marginTop: 10}}>
							<Col span={8} className={styles.tableLay}>
								<Checkbox disabled value="number">
									<span style={{color: '#000'}}>
										车牌号：
									</span>
								</Checkbox>
								<Form.Item name="number" />
							</Col>
							<Col span={8} className={styles.tableLay}>
								<Checkbox disabled value="vin">
									<span style={{color: '#000'}}>
										车架号：
									</span>
								</Checkbox>
								<Form.Item name="vin" />
							</Col>
							<Col span={8} className={styles.tableLay}>
								<Checkbox disabled value="car_id">
									<span style={{color: '#000'}}>
										车辆ID：
									</span>
								</Checkbox>
								<Form.Item name="car_id" />
							</Col>
						</Row>
						<Row gutter={12} style={{marginTop: 10}}>
							<Col span={8} className={styles.tableLay}>
								<Checkbox disabled value="number_type">
									<span style={{color: '#000'}}>
										车牌性质：
									</span>
								</Checkbox>
								<Form.Item name="number_type">
									<Select
										placeholder="请选择"
										allowClear
										fieldNames={{
											value: 'key',
											label: 'label',
										}}
										disabled={
											type === 'view' ||
											bool.includes('number_type')
										}
										options={[...licenseProperty]}
										style={{width: '200px', marginLeft: 28}}
									/>
								</Form.Item>
							</Col>
							<Col span={8} className={styles.tableLay}>
								<Checkbox disabled value="holder_id">
									<span style={{color: '#000'}}>
										持有方：
									</span>
								</Checkbox>
								<Form.Item name="holder_id">
									<Select
										style={{width: '200px', marginLeft: 14}}
										placeholder="请选择"
										fieldNames={{
											value: 'value',
											label: 'valueName',
										}}
										disabled={
											type === 'view' ||
											bool.includes('holder_id')
										}
										options={[...holderDict]}
									/>
								</Form.Item>
							</Col>
							<Col span={8} className={styles.tableLay}>
								<Checkbox disabled value="city_id">
									<span style={{color: '#000'}}>城市：</span>
								</Checkbox>
								<Form.Item name="city_id">
									<Cascader
										fieldNames={{
											label: 'name',
											value: 'id',
											children: 'cityInfoList',
										}}
										options={citysList}
										style={{
											width: '200px',
											marginLeft: '28px',
										}}
										disabled={
											type === 'view' ||
											bool.includes('city_id')
										}
										placeholder="请选择"
									/>
								</Form.Item>
							</Col>
						</Row>
						<Row gutter={12} style={{marginTop: 10}}>
							<Col span={8} className={styles.tableLay}>
								<Checkbox disabled value="fashion_id">
									<span style={{color: '#000'}}>
										品牌车型车系：
									</span>
								</Checkbox>
								<Form.Item name="fashion_id">
									<Select
										placeholder="请选择"
										fieldNames={{
											value: 'id',
											label: 'fullName',
										}}
										disabled={
											type === 'view' ||
											bool.includes('fashion_id')
										}
										allowClear
										options={[...carTypeList]}
										style={{width: '200px'}}
									/>
								</Form.Item>
							</Col>
							<Col span={8} className={styles.tableLay}>
								<Checkbox disabled value="owner">
									<span style={{color: '#000'}}>
										所有人：
									</span>
								</Checkbox>
								<Form.Item name="owner">
									<Input
										placeholder="请输入"
										maxLength={60}
										disabled={
											type === 'view' ||
											bool.includes('owner')
										}
										style={{
											width: '200px',
											marginLeft: '28px',
										}}
									/>
								</Form.Item>
							</Col>
							<Col span={8} className={styles.tableLay}>
								<Checkbox disabled value="org_id">
									<span style={{color: '#000'}}>
										所属公司：
									</span>
								</Checkbox>
								<Form.Item name="org_id">
									<TreeSelect
										showSearch
										style={{width: '200px', marginLeft: 14}}
										dropdownStyle={{
											maxHeight: 400,
											overflow: 'auto',
										}}
										placeholder="请选择"
										allowClear
										treeDefaultExpandAll
										fieldNames={{
											label: 'name',
											value: 'id',
										}}
										disabled={
											type === 'view' ||
											bool.includes('org_id')
										}
										treeDataSimpleMode
										treeData={companyData}
									/>
								</Form.Item>
							</Col>
						</Row>
						{isFullDose ? (
							<Row gutter={12} style={{marginTop: 10}}>
								<Col span={8} className={styles.tableLay}>
									<Checkbox value="randomRatio">
										<span style={{color: '#000'}}>
											盘点比例：
										</span>
									</Checkbox>
									<Form.Item name="randomRatio">
										<InputNumber
											min={1}
											max={100}
											style={{
												width: '200px',
												marginLeft: 28,
											}}
											// defaultValue={1}
										/>
									</Form.Item>
								</Col>
							</Row>
						) : null}
					</Checkbox.Group>
				</Form>

				{isFullDose ? (
					<>
						<div className={styles.isFull}>
							是否匹配全量盘点清单
						</div>
						<Form
							form={basicsForm}
							name="basic"
							layout="horizontal"
							labelCol={{flex: '500px'}}
							labelAlign="right"
							// labelWrap
							autoComplete="off"
							disabled={type === 'view'}
							style={{display: 'flex'}}>
							<Form.Item name="isMatchFullStocktake">
								<Radio.Group
									style={{
										marginLeft: 20,
										display: 'flex',
										alignItems: 'baseline',
									}}
									onChange={(e) => {
										setIsOffer(e.target.value)
										setBool([])
										basicsForm.setFieldValue('parentId', '')
									}}
									// defaultValue={matchFullStocktake}
								>
									<Radio value={0}>否</Radio>
									<Radio value={1}>是</Radio>
								</Radio.Group>
							</Form.Item>
							{IsOffer ? (
								<Form.Item
									name="parentId"
									rules={[
										{
											required: true,
											message: '请选择全盘测试计划',
										},
									]}>
									<Select
										placeholder="请选择"
										disabled={!IsOffer || type === 'view'}
										allowClear
										fieldNames={{
											value: 'id',
											label: 'name',
										}}
										options={[...inventory]}
										onChange={onChangeInventory}
										style={{width: '200px', marginLeft: 28}}
									/>
								</Form.Item>
							) : null}
						</Form>
					</>
				) : null}
				<>
					<div className={styles.isFull}>
						系统字段
						<Checkbox
							value="all"
							style={{marginLeft: 20}}
							disabled={systemFields}
							onChange={(e) => allSelectSys(e)}>
							全选
						</Checkbox>
					</div>
				</>
				<Form
					form={basicsForm}
					name="basic"
					layout="horizontal"
					labelCol={{flex: '300px'}}
					labelAlign="right"
					labelWrap
					autoComplete="off"
					disabled={type === 'view'}>
					<Checkbox.Group
						style={{width: '145%', marginLeft: 20}}
						onChange={sysOnchange}
						value={[...AllSelect]}>
						<Row gutter={12} style={{marginTop: 10}}>
							<Col span={8} className={styles.tableLay}>
								<Checkbox
									value="color_id"
									disabled={
										type === 'view' ||
										bool.includes('color_id')
									}>
									车身颜色
								</Checkbox>
								<Form.Item name="color_id" />
							</Col>
							<Col span={8} className={styles.tableLay}>
								<Checkbox
									value="current_distance"
									disabled={
										type === 'view' ||
										bool.includes('current_distance')
									}>
									车俩当前里程
								</Checkbox>
								<Form.Item name="current_distance" />
							</Col>
							<Col span={8} className={styles.tableLay}>
								<Checkbox
									value="exit_time"
									disabled={
										type === 'view' ||
										bool.includes('exit_time')
									}>
									车辆退出运营日期
								</Checkbox>
								<Form.Item name="exit_time" />
							</Col>
						</Row>
						<Row gutter={12} style={{marginTop: 10}}>
							<Col span={8} className={styles.tableLay}>
								<Checkbox
									value="mot_expiration_time"
									disabled={
										type === 'view' ||
										bool.includes('mot_expiration_time')
									}>
									年检到期日
								</Checkbox>
								<Form.Item name="mot_expiration_time" />
							</Col>
							<Col span={8} className={styles.tableLay}>
								<Checkbox
									value="warehouse_id"
									disabled={
										type === 'view' ||
										bool.includes('warehouse_id')
									}>
									仓库ID
								</Checkbox>
								<Form.Item name="warehouse_id" />
							</Col>
							<Col span={8} className={styles.tableLay}>
								<Checkbox
									value="warehouse_name"
									disabled={
										type === 'view' ||
										bool.includes('warehouse_name')
									}>
									仓库名称
								</Checkbox>
								<Form.Item name="warehouse_name" />
							</Col>
						</Row>
						<Row gutter={12} style={{marginTop: 10}}>
							<Col span={8} className={styles.tableLay}>
								<Checkbox
									value="production_time"
									disabled={
										type === 'view' ||
										bool.includes('production_time')
									}>
									车辆生产日期
								</Checkbox>
								<Form.Item name="production_time" />
							</Col>
							<Col span={8} className={styles.tableLay}>
								<Checkbox
									value="qa_expire_date"
									disabled={
										type === 'view' ||
										bool.includes('qa_expire_date')
									}>
									质保到期时间
								</Checkbox>
								<Form.Item name="qa_expire_date" />
							</Col>
							<Col span={8} className={styles.tableLay}>
								<Checkbox
									value="asserts_owner_id"
									disabled={
										type === 'view' ||
										bool.includes('asserts_owner_id')
									}>
									资产所有方
								</Checkbox>
								<Form.Item name="asserts_owner_id" />
							</Col>
						</Row>
						<Row gutter={12} style={{marginTop: 10}}>
							<Col span={8} className={styles.tableLay}>
								<Checkbox
									value="car_status"
									disabled={
										type === 'view' ||
										bool.includes('car_status')
									}>
									车辆状态：
								</Checkbox>
								{/* <ConfigProvider componentDisabled> */}
								<Form.Item name="car_status">
									<Select
										placeholder="请选择"
										fieldNames={{
											value: 'key',
											label: 'label',
										}}
										disabled={
											type === 'view' ||
											bool.includes('car_status')
										}
										allowClear
										options={[...carStatus]}
										style={{width: '200px', marginLeft: 28}}
									/>
									{/* <Input placeholder='请选择'/> */}
								</Form.Item>
								{/* </ConfigProvider> */}
							</Col>
							<Col span={8} className={styles.tableLay}>
								<Checkbox
									value="commercial_insurance_type"
									disabled={
										type === 'view' ||
										bool.includes(
											'commercial_insurance_type',
										)
									}>
									商业险形式：
								</Checkbox>
								<Form.Item name="commercial_insurance_type">
									<Select
										placeholder="请选择"
										fieldNames={{
											value: 'key',
											label: 'label',
										}}
										disabled={
											type === 'view' ||
											bool.includes(
												'commercial_insurance_type',
											)
										}
										allowClear
										options={[...commercialInsuranceStatus]}
										style={{width: '200px'}}
									/>
								</Form.Item>
							</Col>
							<Col span={8} className={styles.tableLay}>
								<Checkbox
									value="exit_reason"
									disabled={
										type === 'view' ||
										bool.includes('exit_reason')
									}>
									退运原因：
								</Checkbox>
								<Form.Item name="exit_reason">
									<Select
										placeholder="请选择"
										fieldNames={{
											value: 'key',
											label: 'label',
										}}
										disabled={
											type === 'view' ||
											bool.includes('exit_reason')
										}
										allowClear
										options={[...isExitReason]}
										style={{width: '200px'}}
									/>
								</Form.Item>
							</Col>
						</Row>
						<Row gutter={12} style={{marginTop: 10}}>
							<Col span={8} className={styles.tableLay}>
								<Checkbox
									value="mot_status"
									disabled={
										type === 'view' ||
										bool.includes('mot_status')
									}>
									年检状态：
								</Checkbox>
								<Form.Item name="mot_status">
									<Select
										placeholder="请选择"
										allowClear
										fieldNames={{
											value: 'key',
											label: 'label',
										}}
										disabled={
											type === 'view' ||
											bool.includes('mot_status')
										}
										options={[...motStatus]}
										style={{width: '200px', marginLeft: 28}}
									/>
								</Form.Item>
							</Col>
							<Col span={8} className={styles.tableLay}>
								<Checkbox
									value="maintenance_status"
									disabled={
										type === 'view' ||
										bool.includes('maintenance_status')
									}>
									保养状态：
								</Checkbox>
								<Form.Item name="maintenance_status">
									<Select
										placeholder="请选择"
										fieldNames={{
											value: 'key',
											label: 'label',
										}}
										disabled={
											type === 'view' ||
											bool.includes('maintenance_status')
										}
										allowClear
										options={[...maintenanceStatus]}
										style={{width: '200px'}}
									/>
								</Form.Item>
							</Col>
							<Col span={8} className={styles.tableLay}>
								<Checkbox
									value="commercial_insurance_status"
									disabled={
										type === 'view' ||
										bool.includes(
											'commercial_insurance_status',
										)
									}>
									商业险状态：
								</Checkbox>
								<Form.Item name="commercial_insurance_status">
									<Select
										placeholder="请选择"
										fieldNames={{
											value: 'key',
											label: 'label',
										}}
										disabled={
											type === 'view' ||
											bool.includes(
												'commercial_insurance_status',
											)
										}
										allowClear
										options={[...commercialInsuranceStatus]}
										style={{width: '200px'}}
									/>
								</Form.Item>
							</Col>
						</Row>
						<Row gutter={12} style={{marginTop: 10}}>
							<Col span={8} className={styles.tableLay}>
								<Checkbox
									value="compulsory_insurance_status"
									disabled={
										type === 'view' ||
										bool.includes(
											'compulsory_insurance_status',
										)
									}>
									交强险状态：
								</Checkbox>
								<Form.Item name="compulsory_insurance_status">
									<Select
										placeholder="请选择"
										fieldNames={{
											value: 'key',
											label: 'label',
										}}
										disabled={
											type === 'view' ||
											bool.includes(
												'compulsory_insurance_status',
											)
										}
										allowClear
										options={[...compulsoryInsuranceStatus]}
										style={{width: '200px', marginLeft: 28}}
									/>
								</Form.Item>
							</Col>
							<Col span={8} className={styles.tableLay}>
								<Checkbox
									value="is_gps_wired_main"
									disabled={
										type === 'view' ||
										bool.includes('is_gps_wired_main')
									}>
									GPS有线是否安装：
								</Checkbox>
								<Form.Item name="is_gps_wired_main">
									<Select
										placeholder="请选择"
										fieldNames={{
											value: 'key',
											label: 'label',
										}}
										disabled={
											type === 'view' ||
											bool.includes(
												'compulsory_insurance_status',
											)
										}
										allowClear
										options={[...isGPS]}
										style={{width: '200px'}}
									/>
								</Form.Item>
							</Col>
							<Col span={8} className={styles.tableLay}>
								<Checkbox
									value="stop_operate_status"
									disabled={
										type === 'view' ||
										bool.includes('stop_operate_status')
									}>
									停运原因：
								</Checkbox>
								<Form.Item name="stop_operate_status">
									<Select
										placeholder="请选择"
										fieldNames={{
											value: 'key',
											label: 'label',
										}}
										disabled={
											type === 'view' ||
											bool.includes('stop_operate_status')
										}
										allowClear
										options={[...isStopOperate]}
										style={{width: '200px'}}
									/>
								</Form.Item>
							</Col>
						</Row>
						<Row gutter={12} style={{marginTop: 10}}>
							<Col span={8} className={styles.tableLay}>
								<Checkbox
									value="is_gps_wireless"
									disabled={
										type === 'view' ||
										bool.includes('is_gps_wireless')
									}>
									GPS无线是否安装：
								</Checkbox>
								<Form.Item name="is_gps_wireless">
									<Select
										placeholder="请选择"
										fieldNames={{
											value: 'key',
											label: 'label',
										}}
										disabled={
											type === 'view' ||
											bool.includes('is_gps_wireless')
										}
										allowClear
										options={[...isGPS]}
										style={{width: '200px', marginLeft: 28}}
									/>
								</Form.Item>
							</Col>
							<Col span={8} className={styles.tableLay}>
								<Checkbox
									value="is_t_box"
									disabled={
										type === 'view' ||
										bool.includes('is_t_box')
									}>
									T-BOX是否安装：
								</Checkbox>
								<Form.Item name="is_t_box">
									<Select
										placeholder="请选择"
										fieldNames={{
											value: 'key',
											label: 'label',
										}}
										disabled={
											type === 'view' ||
											bool.includes('is_t_box')
										}
										allowClear
										options={[...isTBOX]}
										style={{width: '200px'}}
									/>
								</Form.Item>
							</Col>
							<Col span={8} className={styles.tableLay}>
								<Checkbox
									value="is_obd"
									disabled={
										type === 'view' ||
										bool.includes('is_obd')
									}>
									OBD是否安装：
								</Checkbox>
								<Form.Item name="is_obd">
									<Select
										placeholder="请选择"
										fieldNames={{
											value: 'key',
											label: 'label',
										}}
										disabled={
											type === 'view' ||
											bool.includes('is_obd')
										}
										allowClear
										options={[...isGPS]}
										style={{width: '200px'}}
									/>
								</Form.Item>
							</Col>
						</Row>
						<Row gutter={12} style={{marginTop: 10}}>
							<Col span={8} className={styles.tableLay}>
								<Checkbox
									value="is_plate_reg"
									disabled={
										type === 'view' ||
										bool.includes('is_plate_reg')
									}>
									上牌状态：
								</Checkbox>
								<Form.Item name="is_plate_reg">
									<Select
										placeholder="请选择"
										fieldNames={{
											value: 'key',
											label: 'label',
										}}
										allowClear
										disabled={
											type === 'view' ||
											bool.includes('is_plate_reg')
										}
										options={[...isPlate]}
										style={{width: '200px', marginLeft: 28}}
									/>
								</Form.Item>
							</Col>
							<Col span={8} className={styles.tableLay}>
								<Checkbox
									value="is_social"
									disabled={
										type === 'view' ||
										bool.includes('is_social')
									}>
									是否社会车主：
								</Checkbox>
								<Form.Item name="is_social">
									<Select
										placeholder="请选择"
										fieldNames={{
											value: 'key',
											label: 'label',
										}}
										disabled={
											type === 'view' ||
											bool.includes('is_social')
										}
										allowClear
										options={[...isGPS]}
										style={{width: '200px'}}
									/>
								</Form.Item>
							</Col>
							<Col span={8} className={styles.tableLay}>
								<Checkbox
									value="inventory_warn_status"
									disabled={
										type === 'view' ||
										bool.includes('inventory_warn_status')
									}>
									围栏状态：
								</Checkbox>
								<Form.Item name="inventory_warn_status">
									<Select
										placeholder="请选择"
										fieldNames={{
											value: 'key',
											label: 'label',
										}}
										disabled={
											type === 'view' ||
											bool.includes(
												'inventory_warn_status',
											)
										}
										allowClear
										options={[...isInventory]}
										style={{width: '200px'}}
									/>
								</Form.Item>
							</Col>
						</Row>
						<Row gutter={12} style={{marginTop: 10}}>
							<Col span={8} className={styles.tableLay}>
								<Checkbox
									value="car_license_status"
									disabled={
										type === 'view' ||
										bool.includes('car_license_status')
									}>
									行驶证状态：
								</Checkbox>
								<Form.Item name="car_license_status">
									<Select
										placeholder="请选择"
										fieldNames={{
											value: 'key',
											label: 'label',
										}}
										disabled={
											type === 'view' ||
											bool.includes('car_license_status')
										}
										allowClear
										options={[...carLicenseStatus]}
										style={{width: '200px', marginLeft: 28}}
									/>
								</Form.Item>
							</Col>
							<Col span={8} className={styles.tableLay}>
								<Checkbox
									value="operation_type"
									disabled={
										type === 'view' ||
										bool.includes('operation_type')
									}>
									运营分类：
								</Checkbox>
								<Form.Item name="operation_type">
									<Select
										placeholder="请选择"
										fieldNames={{
											value: 'key',
											label: 'label',
										}}
										disabled={
											type === 'view' ||
											bool.includes('operation_type')
										}
										allowClear
										options={[...operationType]}
										style={{width: '200px'}}
									/>
								</Form.Item>
							</Col>
							<Col span={8} className={styles.tableLay}>
								<Checkbox
									value="online_car_license_status"
									disabled={
										type === 'view' ||
										bool.includes(
											'online_car_license_status',
										)
									}>
									网约车证状态：
								</Checkbox>
								<Form.Item name="online_car_license_status">
									<Select
										placeholder="请选择"
										fieldNames={{
											value: 'key',
											label: 'label',
										}}
										disabled={
											type === 'view' ||
											bool.includes(
												'online_car_license_status',
											)
										}
										allowClear
										options={[...onlineCarLicenseStatus]}
										style={{width: '200px'}}
									/>
								</Form.Item>
							</Col>
						</Row>
					</Checkbox.Group>
				</Form>

				<div className={styles.isFull}>
					自定义字段
					<Checkbox
						// value="A"
						style={{marginLeft: 20}}
						disabled={type === 'view'}
						onChange={(e) => allCutSelectSys(e)}>
						全选
					</Checkbox>
					<Form>
						<Checkbox.Group
							disabled={type === 'view'}
							onChange={customchange}
							value={customSelect}
							className={styles.tableLay}
							style={{
								width: '45%',
								marginLeft: 20,
								marginTop: 45,
								display: 'block',
							}}>
							{customFieldList?.map((item) => (
								<div
									style={{
										display: 'flex',
										justifyContent: 'space-between',
										alignItems: 'baseline',
									}}>
									<Checkbox
										value={item.name}
										disabled={type === 'view'}
										style={{
											marginLeft: 20,
											alignItems: 'center',
										}}>
										{item.name}
									</Checkbox>
									<Form.Item name={item.id}>
										<Select
											placeholder="请选择"
											allowClear
											disabled={
												type === 'view' ||
												!item.typeStatus
											}
											fieldNames={{
												value: 'id',
												label: 'name',
											}}
											options={item.valueScopeList}
											style={{
												width: '200px',
												marginLeft: 28,
											}}
										/>
									</Form.Item>
								</div>
							))}
						</Checkbox.Group>
					</Form>
				</div>

				{/* todo 动态字段的显示  */}
				{isTableDynamic ? (
					<>
						<div
							className={styles.title}
							style={{fontWeight: 600, fontSize: 24}}>
							盘点清单预览
						</div>
						<div
							className={styles.isFull}
							style={{
								display: 'flex',
								justifyContent: 'flex-end',
								paddingRight: '40px',
							}}>
							车辆数据合计：{total}
						</div>
						<Table
							// params={params}
							columns={columns}
							scroll={{x: 500}}
							// pagination
							bordered
							// total={total}
							size="large"
							dataSource={tableList}
						/>
					</>
				) : null}
				{type === 'view' ? (
					<>
						<div className={styles.title}>操作记录</div>
						<OperationRecord
							businessId={query?.id}
							businessType={24}
						/>
					</>
				) : (
					''
				)}
				<div className={styles.wrap}>
					{type === 'view' ? (
						<Button
							onClick={() => {
								history.go(-1)
							}}>
							返回
						</Button>
					) : (
						<>
							{' '}
							<Button
								type="primary"
								htmlType="submit"
								onClick={() => {
									onSave()
								}}>
								保存
							</Button>
							<Button
								onClick={() => {
									history.go(-1)
								}}>
								取消
							</Button>
						</>
					)}
				</div>
				<Modal
					title="新增自定义字段"
					open={customModalOpen}
					onOk={() => {
						customData()
					}}
					onCancel={() => {
						setCustomModalOpen(false)
					}}>
					<Form
						form={basicsForm}
						name="basic"
						layout="horizontal"
						labelCol={{flex: '160px'}}
						labelAlign="right"
						labelWrap
						autoComplete="off"
						disabled={type === 'view'}>
						<Row gutter={12}>
							<Col span={24}>
								<Form.Item
									label="字段名称"
									name="_name"
									rules={[{required: true}]}>
									<Input placeholder="请输入" />
								</Form.Item>
							</Col>
							<Col span={24}>
								<Form.Item
									label="字段类型"
									name="_type"
									rules={[{required: true}]}>
									<Select
										placeholder="请选择"
										allowClear
										fieldNames={{
											value: 'key',
											label: 'label',
										}}
										options={[...enter]}
										onChange={(e) => fieldTypechange(e)}
									/>
								</Form.Item>
							</Col>
							{fieldValue && (
								<Col span={24}>
									<Form.Item
										label="字段取值"
										name="valueScope"
										rules={[{required: true}]}>
										<TextArea
											maxLength={200}
											placeholder="请输入（最多200个字）,使用逗号分隔不同选择项。"
											autoSize={{minRows: 3, maxRows: 6}}
										/>
									</Form.Item>
								</Col>
							)}
						</Row>
					</Form>
				</Modal>
			</div>
		)
	},
)

export default connect(({user}: any) => ({user}))(add)
